<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
		<meta name="viewport"
			content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
		<link rel="stylesheet" href="js/layui/css/layui.css" media="all">
		<title>智慧巴士-提交订单</title>
		<style>
			.layui-container {
				margin-top: 10px;
				height: 40px;
				line-height: 40px;
			}

			.title {
				text-align: center;
				background-color: #009F95;
			}

			.null {
				color: #fff;
			}

			.layui-card-header {
				background-color: #E4E4E4;
			}

			#l-map {
				height: 300px;
				width: 100%;
				/*z-index: 0;*/
			}

		</style>
	</head>
	<body>
		<div class="layui-container">
			<div class="layui-row" style="margin-bottom: 10px;">
				<div class="layui-col-xs1 null">
					1
				</div>
				<div class="layui-col-xs10">
					<button type="button" id="prev-btn" class="layui-btn layui-btn-sm layui-btn-primary">
						<i class="layui-icon layui-icon-left">返回</i>
					</button>
				</div>
				<div class="layui-col-xs1 null">
					1
				</div>
			</div>
			<div class="layui-row">
				<div class="layui-col-xs1 null">
					1
				</div>
				<div class="layui-col-xs10 title">
					提交订单
				</div>
				<div class="layui-col-xs1 null">
					1
				</div>
			</div>

			<div class="layui-row">
				<div class="layui-col-xs1 null">
					<span class="bus-id">1</span>
				</div>
				<div class="layui-col-xs10 bus-map">
					<div class="layui-card">
						<div class="layui-card-header">订单信息</div>
						<div class="layui-card-body">
							<li>乘车日期:<input type="text" class="layui-input" readonly id="date"  /></li>
							<li>起点:<input type="text" class="layui-input" readonly id="startPoint"  /></li>
							<li>终点:<input type="text" class="layui-input" readonly  id="endPoint"/></li>
							<div class="layui-card-header">
								<p style="float: left">乘客信息</p>
							</div>
							<div class="layui-card-body" id="userInfoDiv">

							</div>
						</div>
					</div>
				</div>
				<div class="layui-col-xs1 null">
					1
				</div>
			</div>
			<div class="layui-row" style="margin-top: 10px;">
				<div class="layui-col-xs1 null">
					1
				</div>
				<div class="layui-col-xs10" style="text-align: center;">
					<button type="button" id="next-btn" class="layui-btn" style="width: 60%;">提交订单</button>
				</div>
				<div class="layui-col-xs1 null">
					1
				</div>
			</div>
		</div>
		<script src="js/jquery.min.js"></script>
		<script src="js/layui/layui.js"></script>
		<script src="js/layer/layer.js"></script>
		<script src="js/common.js"></script>
		<script src="js/jquery.cookie.js"></script>
		<script type="text/javascript">

			$(function() {

				//数据加载
				var busOrder = JSON.parse(localStorage.getItem("busOrder"));
				$("#date").val(busOrder.date);
				$("#startPoint").val(busOrder.location.startPoint);
				$("#endPoint").val(busOrder.location.endPoint);

				busOrder.userInfoArr.forEach(function (userInfo) {
					var panel = $("<div class=\"layui-panel\"></div>");
					panel.append("<li>乘客姓名:<input type=\"text\" class=\"layui-input\"  readonly name=\"name\" value='"+userInfo.name+"'/></li>")
							.append("<li>手机号:<input type=\"text\" class=\"layui-input\" readonly  name=\"phone\" value='"+userInfo.phone+"'/></li>").append("</div>");
					$("#userInfoDiv").append(panel);
				});

				$("#prev-btn").on("click", function() {
					window.location.href = "bus-order2.html";
				});

				$("#next-btn").on("click", function() {

					$.ajax({
						url:baseUrl+"bus/newOrder.json",
						data:JSON.stringify(JSON.parse(localStorage.getItem("busOrder"))),
						type:"post",
						dataType:"json",
						contentType: "application/json;charset=UTF-8",
						success:function (data){
							if (data.code==="200"){
								localStorage.clear();
								window.location.href="bus-list.html";
							}

						}

					})


				});
			})
		</script>
	</body>
</html>
